<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width,initial-scale=1">
  <link rel="stylesheet" href="../framework/font-awesome-4.7.0/css/font-awesome.min.css">
  <link rel="stylesheet" href="../css/reset.css">
  <link rel="stylesheet" href="../css/orderlist.css">
  <script src="index.js"></script>
    <title>订单记录</title>
</head>
<body>
<div class="wrapper">
  <!--header-->
  <div class="header" >
    <div class="location-icon">
      <i class="fa fa-map-marker" style="font-size: 3.5vw;"></i>
    </div>
    <div class="location-text">
      昆明<i class="fa fa-angle-down" aria-hidden="true"></i>
    </div>

  </div>

  <!--search部分-->
  <div class="search" id="fixedBox">
    <div class="search-fixed-top">
      <div class="search-box">
        <i class="fa fa-search"></i>
        我的订单
        <div class="search-button">搜索</div>
      </div>

      <img src="../img/Snipaste_2024-07-10_19-03-47.png" height="49" width="40"/></div>
  </div>
  <!-- 订单分类标签 -->
  <div class="order-tabs">
    <span class="active">全部订单</span>
    <span>待评价</span>
    <span>退款</span>
  </div>
  <!-- 订单记录 -->
  <ul class="order-list">
    <li class="order-item">
      <div class="order-header">
        <img src="../img/Snipaste_2024-07-09_18-13-09.png" height="197" width="197"/>
        <div class="order-header-left">

          <div class="shop-name">
            迈德思客.炸鸡汉堡(灞桥火车站店) >
          </div>
          <div class="red-packet">
            <p>10减1</p>
            <p>30减8</p>
            <p>15减2</p>
          </div>
        </div>
        <div class="order-status" onclick="location.href='order.html'" style="color: red">
              去支付
        </div>
      </div>
      <div class="order-content">
        <img src="../img/Snipaste_2024-07-09_18-13-09.png" height="197" width="197"/>
        <div class="order-details">
            <div class="price">
              <div class="product-name">奥尔良蜜汁鸡腿饭</div>
              <div class="product-price">¥14.9</div>
            </div>

          <div class="product-quantity">共1件</div>
        </div>

      </div>
      <div class="order-actions">
        <button class="btn">再来一单</button>
        <button class="btn">小问卷</button>
        <div class="btn-evaluate">评价</div>
      </div>
    </li>
    <li class="order-item">
      <div class="order-header">

        <img src="../img/Snipaste_2024-07-10_22-44-00.png" height="73" width="73"/>
        <div class="order-header-left">

          <div class="shop-name">
            德克士.炸鸡汉堡  >
          </div>
          <div class="red-packet">
            <p>10减1</p>
            <p>30减8</p>
            <p>15减2</p>
          </div>
        </div>
        <div class="order-status">
          已完成
        </div>
      </div>
      <div class="order-content">

        <img src="../img/Snipaste_2024-07-10_22-48-21.png" height="187" width="242"/>
        <div class="order-details">
          <div class="price">
            <div class="product-name">照烧鸡腿饭
              </div>
            <div class="product-price">¥17.9</div>
          </div>

          <div class="product-quantity">共1件</div>
        </div>

      </div>
      <div class="order-actions">
        <button class="btn">再来一单</button>
        <button class="btn">小问卷</button>
        <div class="btn-evaluate">评价</div>
      </div>
    </li>
    <li class="order-item">
      <div class="order-header">

        <img src="../img/Snipaste_2024-07-10_22-44-36.png" height="63" width="65"/>
        <div class="order-header-left">

          <div class="shop-name">
            达令虎意式手工披萨9.9   >
          </div>
          <div class="red-packet">
            <p>10减1</p>
            <p>30减8</p>
            <p>15减2</p>
          </div>
        </div>
        <div class="order-status">
          已完成
        </div>
      </div>
      <div class="order-content">

        <img src="../img/Snipaste_2024-07-10_22-49-05.png" height="106" width="148"/>
        <div class="order-details">
          <div class="price">
            <div class="product-name">9寸夏威夷披萨</div>
            <div class="product-price">¥15.9</div>
          </div>

          <div class="product-quantity">共1件</div>
        </div>

      </div>
      <div class="order-actions">
        <button class="btn">再来一单</button>
        <button class="btn">小问卷</button>
        <div class="btn-evaluate">评价</div>
      </div>
    </li>
  </ul>
  <ul class="footer">
    <li onclick="location.href='index.html'"><img src="../img/Snipaste_2024-07-08_17-23-52.png" height="48" width="50"/>
      <p></p>
    </li>
    <li><img src="../img/Snipaste_2024-07-08_17-54-22.png" height="46" width="50"/>
      <p>视频</p>
    </li>
    <li><img src="../img/Snipaste_2024-07-08_17-53-37.png" height="48" width="54"/>
      <p>消息</p>
    </li>
    <li onclick="location.href='orderlist.html'"><img src="../img/Snipaste_2024-07-09_10-30-24.png" height="53" width="54"/>
      <p>订单</p>
    </li>
    <li onclick="location.href='login.html'"><img src="../img/Snipaste_2024-07-08_17-41-31.png" height="36" width="44"/>
      <p> 我的</p>
    </li>
  </ul>
</div>

</body>
</html>